@import './common';

.list-box{
	box-sizing: border-box;
	padding:setSize(8);

	.list-item-box{
		width:50%;

		.list-item{
			width: 100%;
			box-sizing: border-box;
			padding:setSize(8) setSize(8) setSize(56);

			.list-inner{
				border-radius:setSize(10);
				// background-color: #fff;
				font-size: setSize(28);
				// color:#34393e;

				.img-box{
					position: relative;
					max-height: setSize(500);

					.cover{
						position:absolute;
						top: setSize(30);
						right: setSize(30);
						width: setSize(42);
						height: setSize(42);
						border-radius:50%;
					}

					.img{
						display: block;
						width: 100%;
						height: 100%;
						border-radius:setSize(10);
					}
				}

				.text-box{
					box-sizing: border-box;
					padding:setSize(20) setSize(20) 0;
					overflow: hidden;

					.text{
						height: setSize(72);
						line-height: setSize(36);
						font-size: setSize(28);
						font-weight: 400;
						@include lineClamp(2);
						overflow: hidden;
					}
				}

				.time{
					box-sizing: border-box;
					padding:setSize(10) setSize(20) 0;
					font-size: setSize(22);
					color: #999;
					@include ellipsis;
				}

				.list-foot{
					box-sizing: border-box;
					padding:setSize(10) setSize(20) setSize(12);
					color: #CECECE;
					font-size: setSize(20);
					font-weight: 400;

					.avat-img{

						.avat{
							display: block;
							width: setSize(40);
							height: setSize(40);
							border-radius:50%;
						}
					}

					.name{
						box-sizing:border-box;
						padding:0 setSize(8);
						@include ellipsis;
					}

					.icon-box{

						.icon{
							display: block;
							width: setSize(34);
							height: setSize(34);
						}
					}

					.num{
						margin-left: setSize(8);
						font-size: setSize(28);
					}
				}
			}
		}
	}	
}